<template>
  <el-select size="small" v-model="level" @change="changeLevel" v-loading="loading">
    <el-option value="admin" label="管理员" />
    <el-option value="member" label="成员" />
  </el-select>
</template>

<script>
export default {
  name: 'members-level-select',
  props: {
    member: Object,
  },
  data() {
    return {
      level: this.member.level,
      loading: false,
    };
  },
  methods: {
    changeLevel(level) {
      this.loading = true;
      this.$api.spaceMembers.setLevel({
        spaceId: this.$route.params.spaceId,
        memberId: this.member.id,
        level,
      }).then(() => this.$message.success('设置成功'))
        .catch(() => { this.level = this.member.level; }) // 失败重置
        .then(() => { this.loading = false; });
    },
  },
};
</script>

<style></style>
